<!--
 * @Author: your name
 * @Date: 2020-12-15 09:23:53
 * @LastEditTime: 2020-12-18 09:41:29
 * @LastEditors: Please set LastEditors
 * @Description: In User Settings Edit
 * @FilePath: \uniapp-ts-uview\src\pages\index\components\memberdisplay.vue
-->
<template>
  <view class="member">
    <view class="member_title">
      <label >优秀会员</label>
    </view>
    <scroll-view scroll-x class="scrv">
      <view class="scrv_item" v-for="(item, index) in 6" :key="index">
        <view class="item_content">
          <image
            src="https://7869-xiaolidaodian-d15qm-1302750752.tcb.qcloud.la/avater.png?sign=306df54e495b032f6210aae95ded4058&t=1608003668"
            mode="aspectFill"
            lazy-load
          ></image>
          <view class="item_content_name">潘金军</view>
          <view class="item_content_content">
            <text>深圳市久久秀世家服饰有限公司</text>
          </view>
        </view>
      </view>
    </scroll-view>
  </view>
</template>

<style lang="scss" scoped>
.member {
  width: auto;
  height: 380upx;
  background-color: #ffffff;
  box-sizing: border-box;
  border-radius: 10upx;
  margin: 0 20upx;
  display: flex;
  flex-direction: column;
  .member_title {
    font-size: 30upx;
    margin-top: 30upx;
    margin: 30upx 30upx 19upx 20upx;
    font-weight: bold;
  }

  .scrv {
    white-space: nowrap;
    box-sizing: border-box;
    padding: 0upx 20upx 0upx 10upx;
    .scrv_item {
      display: inline-block;
      width: 190upx;
      height: 260upx;
      background-color: #f2f2f2;
      margin-left: 10upx;
      border-radius: 6upx;
      .item_content {
        width: 100%;
        height: 100%;
        display: flex;
        flex-direction: column;
        image {
          width: 100upx;
          height: 100upx;
          margin-top: 20upx;
          margin-left: 45upx;
        }
        .item_content_name {
          width: 100%;
          height: auto;
          display: flex;
          justify-content: center;
          margin-top: 19upx;
          font-size: 28upx;
        }
        .item_content_content {
          width: 100%;
          height: auto;
          box-sizing: border-box;
          padding: 0upx 14upx 0upx 24upx;
          margin-top: 10upx;
          font-family: HiraginoSansGB-W3;
          font-size: 18rpx;
          text {
            word-wrap: break-word;
            word-break: break-all;
            white-space: pre-line;
          }
        }
      }
    }
  }
}
</style>
